<script lang="ts" setup>
import { ref } from 'vue';

const ifShows=ref(true)
const ifShow=()=>{
  ifShows.value=!ifShows.value
}
</script>

<template>
  <button @click="ifShow()">显示/隐藏</button>
<div class="ifShowbox" v-show="ifShows">v-show</div>
<div class="ifShowbox" v-if="ifShows">v-if</div>
</template>

<style scoped>
.ifShowbox{
  width: 200px;
  height: 200px;
  margin: 20px;
  background-color: #f00;
}
</style>